/**
 * Input 组件的主题配置
 * 
 * 基于企业级设计规范 (Input.json) 的完整配置
 * 包含所有输入框样式定义
 */

import type { ComponentToken } from 'antd/es/input/style';

// ========== 设计 Token 常量 ==========

/**
 * 间距相关 Token
 */
const SPACING_TOKENS = {
  // 横向内边距
  paddingInline: {
    default: 11,
    small: 11,
    large: 11,
  },
  
  // 纵向内边距
  paddingBlock: {
    default: 4,
    small: 1,
    large: 7,
  },
} as const;

/**
 * 颜色相关 Token
 */
const COLOR_TOKENS = {
  // 背景颜色
  background: {
    addon: '#fafafa',
    hover: '#ffffff',
    active: '#ffffff',
  },
  
  // 边框颜色
  border: {
    hover: '#40a9ff',
    active: '#1677ff',
  },
} as const;

/**
 * 阴影相关 Token
 */
const SHADOW_TOKENS = {
  active: '0 0 0 2px rgba(5, 145, 255, 0.1)',
  errorActive: '0 0 0 2px rgba(255, 38, 5, 0.06)',
  warningActive: '0 0 0 2px rgba(250, 173, 20, 0.1)',
} as const;

/**
 * 字体相关 Token
 */
const FONT_TOKENS = {
  fontSize: {
    default: 14,
    small: 14,
    large: 16,
  },
} as const;

/**
 * Input 完整主题配置
 * 
 * 根据设计规范文件 Input.json 定义的企业级输入框样式
 * 涵盖所有输入框类型、状态和尺寸的完整配置
 * 
 * @example
 * ```tsx
 * <ConfigProvider theme={{ components: { Input: inputThemeConfig } }}>
 *   <Input placeholder="请输入内容" />
 *   <Input size="large" placeholder="大尺寸输入框" />
 *   <Input size="small" placeholder="小尺寸输入框" />
 *   <Input.TextArea placeholder="文本域" />
 * </ConfigProvider>
 * ```
 */
export const inputThemeConfig: Partial<ComponentToken> = {
  // ========== 间距配置 ==========
  // 默认尺寸间距
  paddingInline: SPACING_TOKENS.paddingInline.default,
  paddingBlock: SPACING_TOKENS.paddingBlock.default,
  
  // 小尺寸间距
  paddingInlineSM: SPACING_TOKENS.paddingInline.small,
  paddingBlockSM: SPACING_TOKENS.paddingBlock.small,
  
  // 大尺寸间距
  paddingInlineLG: SPACING_TOKENS.paddingInline.large,
  paddingBlockLG: SPACING_TOKENS.paddingBlock.large,
  
  // ========== 字体配置 ==========
  inputFontSize: FONT_TOKENS.fontSize.default,
  inputFontSizeSM: FONT_TOKENS.fontSize.small,
  inputFontSizeLG: FONT_TOKENS.fontSize.large,
  
  // ========== 背景颜色配置 ==========
  addonBg: COLOR_TOKENS.background.addon,
  hoverBg: COLOR_TOKENS.background.hover,
  activeBg: COLOR_TOKENS.background.active,
  
  // ========== 边框颜色配置 ==========
  hoverBorderColor: COLOR_TOKENS.border.hover,
  activeBorderColor: COLOR_TOKENS.border.active,
  
  // ========== 阴影效果配置 ==========
  activeShadow: SHADOW_TOKENS.active,
  errorActiveShadow: SHADOW_TOKENS.errorActive,
  warningActiveShadow: SHADOW_TOKENS.warningActive,
};

/**
 * 获取 Input 主题配置
 * 
 * 支持部分覆盖默认配置，可以基于完整的设计规范进行定制
 * 
 * @param customConfig 自定义配置（可选）
 * @returns 合并后的主题配置
 * 
 * @example
 * ```tsx
 * // 基于设计规范的定制
 * const myInputTheme = getInputTheme({
 *   hoverBorderColor: '#ff6b35',       // 自定义悬浮边框颜色
 *   activeBorderColor: '#ff4500',      // 自定义激活边框颜色
 *   inputFontSizeLG: 18,              // 自定义大尺寸字体大小
 * });
 * 
 * <ConfigProvider theme={{ components: { Input: myInputTheme } }}>
 *   <Input placeholder="自定义样式输入框" />
 * </ConfigProvider>
 * ```
 */
export const getInputTheme = (
  customConfig?: Partial<ComponentToken>
): Partial<ComponentToken> => {
  return {
    ...inputThemeConfig,
    ...customConfig,
  };
};

/**
 * 导出 Input 组件的 Token 类型
 * 方便 TypeScript 类型检查和开发时的智能提示
 */
export type { ComponentToken as InputComponentToken } from 'antd/es/input/style';

